/**
 * 创建一个HTML元素。
 *
 * 该函数通过指定标签名、属性和内部内容，动态创建一个HTML元素。
 * 它允许对创建的元素进行详细的定制，包括设置属性和内部HTML内容。
 *
 * @param tagName {string} - 元素的标签名，默认为空字符串。如果为空，则函数返回null。
 * @param attributes {Object | undefind} - 元素的属性，以键值对的形式指定。键是属性名，值是属性值。
 * @param innerContent {string | Element | undefind} - 元素的内部内容，可以是字符串或另一个HTML元素。
 * @returns {Element | null} - 返回创建的元素对象，如果tagName为空则返回null。
 */
const createEle = function (
  tagName: string,
  attributes?: { [key: string]: string },
  innerContent?: string | Element
): Element | null {
  if (!tagName) return null
  const Ele = document.createElement(tagName)
  if (
    attributes &&
    Object.prototype.toString.call(attributes) === '[object Object]'
  ) {
    for (const keyName of Object.keys(attributes)) {
      if (keyName && attributes[keyName]) {
        Ele.setAttribute(keyName.toString(), attributes[keyName].toString())
      }
    }
  }
  if (typeof innerContent === 'string') {
    Ele.innerHTML = innerContent
  } else if (innerContent instanceof Element) {
    Ele.appendChild(innerContent)
  }
  return Ele
}

export default createEle
